<template>
	<view class="container">
		<view class="container-top">
			<text class="orderstatus">已接单</text>
			<text class="statustext">等待上门中，请勿迟到</text>
		</view>
		<view class="container-bottom">
			<view class="orderinfoitem">
				<u-cell-group :border="false">
					<u-cell-item title="顾客姓名" value="王静" :arrow="false" hover-class="none" :border-bottom="false"></u-cell-item>
					<u-cell-item title="手机号码" value="联系顾客" :arrow="false" hover-class="none" :border-bottom="false" :value-style="{color:'rgba(98, 164, 251, 1)'}">
						<u-icon name="phone" size="30" slot="right-icon" color="rgba(98, 164, 251, 1)"></u-icon>
					</u-cell-item>
					<u-cell-item title="上门时间" value="9月5日 5:00 至 6:00" :arrow="false" hover-class="none" :border-bottom="false"></u-cell-item>
					<u-cell-item title="工种" value="水电" :arrow="false" hover-class="none" :border-bottom="false"></u-cell-item>
					<u-cell-item title="售后" value="无售后" :arrow="false" hover-class="none" :border-bottom="false"></u-cell-item>
				</u-cell-group>
			</view>
			<view class="orderinfoitem">
				<u-cell-group :border="false">
					<u-cell-item title="支付金额" :value="price|addPaysign" :arrow="false" hover-class="none" :border-bottom="false" :value-style="{color:'red'}"></u-cell-item>
					<u-cell-item title="优惠券" :value="price|addSubpaysign" :arrow="false" hover-class="none" :border-bottom="false" :value-style="{color:'red'}"></u-cell-item>
					<u-cell-item title="准时达" :value="price|addPaysign" :arrow="false" hover-class="none" :border-bottom="false" :value-style="{color:'red'}"></u-cell-item>
					<u-cell-item title="地址" value="江苏省徐州市鼓楼区和兴广场家乐福1号楼2号门" :arrow="false" hover-class="none" :border-bottom="false"></u-cell-item>
				</u-cell-group>
			</view>
			<view class="orderinfoitem">
				<u-cell-group :border="false">
					<u-cell-item title="订单编号" value="5674445645645 " :arrow="false" hover-class="none" :border-bottom="false" ></u-cell-item>
					<u-cell-item title="支付方式" value="微信" :arrow="false" hover-class="none" :border-bottom="false" ></u-cell-item>
					<u-cell-item title="下单时间" value="2020-19-12 11:23" :arrow="false" hover-class="none" :border-bottom="false" ></u-cell-item>
				</u-cell-group>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				price:202
			}
		},
		methods: {
			
		},
		filters:{
			addPaysign:function(val){
				return '￥'+val;
			},
			addSubpaysign:function(val){
				return '-￥'+val;
			}
		}
	}
</script>

<style lang="scss">
      page{
		  width: 100%;
		  height: 100%;
	  }
	  .container{
		  width: 100%;
		  min-height: 100%;
		  background-color: rgba(244, 248, 251, 1);
		  .container-top{
			  width: 100%;
			  height: 300upx;
			  background-color: #FFFFFF;
			  display: flex;
			  flex-wrap: wrap;
			  flex-direction: column;
			  justify-content: center;
			  align-items: center;
		  }
		  .orderstatus{
			  font-size: 50upx;
			  display: block;
			  width: 100%;
			  text-align: center;
		  }
		  .statustext{
			  font-size: 30upx;
			  margin-top: 40upx;
		  }
		  .container-bottom{
			  width: 100%;
			  height: auto;
			  padding-bottom: 20upx;
			  .orderinfoitem{
				  background-color: #FFFFFF;
				  width: 100%;
				  height: auto;
				  margin-top: 20upx;
			  }
			  .u-cell{
				  padding: 20upx;
			  }
		  }
	  }
</style>
